import Taro, { Component } from '@tarojs/taro'
import { View, Image, Text } from '@tarojs/components'
import { DNavBar, DModal } from '@/components'
import DHeader from './component/header'
import DContent from './component/content'
import DList from './component/list'
import DFooter from './component/footer'
import classNames from 'classnames'
import http from '@/api'
import sdk from '@/common/sdk'
import dayjs from 'dayjs'
import './itemdetail.scss'

class Dfinancedetail extends Component {

  constructor(props) {
    super(props)
    this.state = {
      bgImages: require('../assets/bgImages.png'),
      title: "库融订单",
      headerobj: {
        itemtime: {
          isShowDay: false,
          isShowHour: true,
          day: 0,
          hours: 0,
          minutes: 0,
          seconds: 0
        }
      },
      status: '',
      id: '',
      isShow: false,
      item: {},
      modal1: '',
      crmodal: '',
      firstList: {
        info: [
          {
            label: "用款天数",
            value: ""
          },
          {
            label: "用款日期",
            value: ""
          }
        ]
      },
      secondList: {
        info: []
      },
      threeList: {
        title: "",
        info: [
          {
            label: "监管方式",
            value: ""
          },
          {
            label: "监管地址",
            value: ""
          }
        ]
      },
      dlist1: {
        list: [
          {
            title: '入库照片'
          }
        ]
      },
      dlist2: {
        list: [
          {
            title: '合同凭证'
          }
        ]
      }
    }
  }

  componentWillMount() {
    let { id, status, type } = this.$router.params
    this.getDetail(id)
    this.setState({
      headerobj: {
        title: this.getType(status),
        text: this.getText(status),
        tiptext: this.getPlatformTxt(status),
      },
      id,
      status
    })
  }

  componentDidShow() {
    sdk.setTitleInfo(this.state.title)
  }

  getType(type) {
    // console.log(889, type)
    return {
      $0: '待资方审核',
      $1: '待资方上传',
      $2: '待确认',
      $3: '车辆运输中',
      $4: '待资方上传',
      $5: '待确认',
      $6: '交易成功',
      $7: '审核未通过',
      $8: '已撤回',
      $9: '交易异常'
    }[`$${type}`]
  }
  getPlatformTxt(orstatu) {
    return {
      $5: '系统将自动确认',
      //   $4: '请耐心等候',
    }[`$${orstatu}`]
  }
  getText(orstatu) {
    return {
      $0: '资金方正在审核，请耐心等待',
      $1: '资金方将上传验车照片，请耐心等候',
      $2: '车辆即将入库，请查看入库照片查验车辆',
      $4: '交易完成后，资金方将上传资料，请耐心等候',
      $5: '请确认资金方所上传的资料',
      $6: '亲，恭喜你成功完成一笔订单！',
      $7: '很遗憾，您的库融申请未通过审核，您可再次提交申请',
      $8: '代购申请已被撤回',
      $9: '您的订单交易异常，平台客服已介入并终止 ',
    }[`$${orstatu}`]
  }
  getDetail() {
    let { firstList, secondList, threeList } = this.state
    let { id, status } = this.$router.params
    http.getFormInfo(id).then(res => {
      if (!res) {
        return;
      }
      if(res.status !== this.$router.params.status){
        Taro.showToast({
          title:'订单状态已更新',
          icon:'none' 
        }).then(date=>{
            Taro.redirectTo({
                url:`/pages/itemdetail/financedetail?id=${res.id}&status=${res.status}`
              })
        })
      }
      let _firstList = ['amSpendPeriod', 'amSpendDate']

      firstList.info.map((item, i) => {
        //console.log(77, res['amSpendPeriod'])
        item.value = res[_firstList[i]]
      })

      res.carList.map((item, i) => {
        secondList.info.push({
          label: `库融车辆${i + 1}`,
          value: item.adCarType,
          icon: 'right',
          carNo: item.adCarNo,
          id: res.id
        })
      })
      secondList.info.push({
        label: '库融总额',
        value: res.amFinnanceMoney,
      })

      let _threeList = ['amMonitorType', 'amMonitorAddr']
      threeList.info.map((item, i) => {
        item.value = res[_threeList[i]]
      })

      //根据订单状态计算倒计时
      let orStatus = this.$router.params.status
      let times = ''
      if (orStatus === '5') {
        let createTime = dayjs(res.updateTime).add(3, 'day')
        times = createTime.diff(dayjs(), 'day', 'true')
      } else {
        times = 0
      }
      this.setState({
        firstList,
        secondList,
        threeList,
        headerobj: {
          ...this.state.headerobj,
          account: res.orderNo,
          itemtime: {
            isShowDay: false,
            isShowHour: true,
            day: times,
            hours: 0,
            minutes: 0,
            seconds: 0
          }
        },
        item: res
      })

    })

  }
  handleCarPhoto() {
    Taro.navigateTo({
      url: `/pages/inspectionphotos/inspectionphotos?id=${this.state.id}&status=0&active=1`
    })
  }
  handleContact() {
    Taro.navigateTo({
      url: `/pages/inspectionphotos/inspectionphotos?id=${this.state.id}&status=0&active=2`
    })
  }
  //撤回
  onDraworder() {
    this.setState({
      isShow: true
    })
  }
  //撤回库融订单
  getCancelInfo(id) {
    http.getCancelInfo({ id: id }).then(res => {
      Taro.redirectTo({
        url: `/pages/itemdetail/financedetail?id=${id}&status=8`
      })
    })
  }
  //确认验车
  onConfirmCar() {
    Taro.redirectTo({
      url: `/pages/inspectionphotos/inspectionphotos?id=${this.state.id}&active=1&status=1`
    })
  }
  //确认合同
  onConfirmProof() {
    Taro.redirectTo({
      url: `/pages/inspectionphotos/inspectionphotos?id=${this.state.id}&active=2&status=1`
    })
  }
  //查看物流
  handleLooklogis() {

  }
  onClose() {
    this.setState({
      isShow: false
    })
  }
  onLastHandle() {
    let { id } = this.state
    this.onClose()
    this.getCancelInfo(id)
  }
  handleSubmitAsign() {
    Taro.redirectTo({
      url: `/pages/financingapplication/financingapplication?id=${this.state.id}`
    })
  }

  //查看库融车辆详情
  handleCarDetail(item) {
    Taro.navigateTo({
      url: `/pages/inventoryvehiclesdetail/inventoryvehiclesdetail?carNo=${item.carNo}&id=${item.id}`
    })
  }
  render() {
    const {
      bgImages,
      title,
      isShow,
      firstList,
      secondList,
      threeList,
      dlist1,
      dlist2,
      status,
      headerobj
    } = this.state
    let imgList = [{ title: '库融车辆' }]
    return (
      <View className='b_itemdetail'>
        <Image src={bgImages} className={classNames('b_itemdetail__imagebs', process.env.NODE_ENV === 'development' ? '' : 'b_itemdetail__NODEimg')}></Image>
        <DNavBar title={title} className='b_itemdetail__nav'></DNavBar>
        <View className='b_itemdetail__box'>
          <View className='b_itemdetail__content'>
            <DHeader {...headerobj}></DHeader>
            <DContent {...firstList}></DContent>
            <DContent {...secondList} handleDetail={this.handleCarDetail.bind(this)}></DContent>
            <DContent {...threeList}></DContent>
            {status > 2 && status !== '8' &&
              <DList {...dlist1} handleClick={this.handleCarPhoto.bind(this)}></DList>
            }
            {status > 5 && status !== '8' &&
              <DList {...dlist2} handleClick={this.handleContact.bind(this)}></DList>
            }
            {status === '0' &&
              <DFooter firstText='撤回审核' onFirstClick={this.onDraworder.bind(this)}></DFooter>
            }
            {status === '2' &&
              <DFooter secondText='确认验车' onSeconClick={this.onConfirmCar.bind(this)}></DFooter>
            }
            {status === '5' &&
              <DFooter secondText='确认合同' onSeconClick={this.onConfirmProof.bind(this)}></DFooter>
            }
            {status === '7' &&
              <DFooter secondText='重新提交' onSeconClick={this.handleSubmitAsign.bind(this)}></DFooter>
            }
          </View>
        </View>

        <DModal
          isShow={isShow}
          title='提示'
          text='确认撤回订单吗？'
          firstbtn='取消'
          lastbtn='确认'
          onFirst={this.onClose.bind(this)}
          onCancel={this.onClose.bind(this)}
          onLast={this.onLastHandle.bind(this)}
        ></DModal>
      </View>
    )
  }

}


export default Dfinancedetail